<html>
<body>
<h1>Spring Boot file upload example</h1>
<form method="POST" action="http://192.168.22.28:8080/user/upload" enctype="multipart/form-data">
    <input type="file" name="file" /><br/><br/>
    <input type="file" name="file" /><br/><br/>
    <input type="submit" value="Submit" />
</form>

<hr>
<form id="form1">
    <label for="exampleInputEmail1">头像</label>
    <input type="button" value="上传图片" onclick="f.click()" class="btn_mouseout"/><br>
    <p><input type="file" id="f" name="f" onchange="sc(this);" style="display:none"/></p>
</form>
<div id="result"></div>
<script src="jquery.js"></script>
<script>
function sc(){
    var animateimg = $("#f").val(); //获取上传的图片名 带//
    var imgarr=animateimg.split('\\'); //分割
    var myimg=imgarr[imgarr.length-1]; //去掉 // 获取图片名
    var houzui = myimg.lastIndexOf('.'); //获取 . 出现的位置
    var ext = myimg.substring(houzui, myimg.length).toUpperCase();  //切割 . 获取文件后缀

    var file = $('#f').get(0).files[0]; //获取上传的文件
    var fileSize = file.size;           //获取上传的文件大小
    var maxSize = 1048576;              //最大1MB
    if(ext !='.PNG' && ext !='.GIF' && ext !='.JPG' && ext !='.JPEG' && ext !='.BMP'){
        parent.layer.msg('文件类型错误,请上传图片类型');
        return false;
    }else if(parseInt(fileSize) >= parseInt(maxSize)){
        parent.layer.msg('上传的文件不能超过1MB');
        return false;
    }else{
        var data = new FormData($('#form1')[0]);
        $.ajax({
            url: "{:url('User/uppic')}",
            type: 'POST',
            data: data,
            dataType: 'JSON',
            cache: false,
            processData: false,
            contentType: false
        }).done(function(ret){
            if(ret['isSuccess']){
                var result = '';
                var result1 = '';
                // $("#show").attr('value',+ ret['f'] +);
                result += '<img src="' + '__ROAD__' + ret['f']  + '" width="100">';
                result1 += '<input value="' + ret['f']  + '" name="user_headimg" style="display:none;">';
                $('#result').html(result);
                $('#show').html(result1);
                layer.msg('上传成功');
            }else{
                layer.msg('上传失败');
            }
        });
        return false;
       }
    }
</script>
</body>
</html>